<template>
  <div>
    <table border="1">
        <thead>
            <tr>
                <th>姓名</th>
                <th>性别</th>
                <th>年龄</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            <tr v-for="stu in students" :key="stu._id">
                <td>{{stu.name}}</td>
                <td>{{stu.gender}}</td>
                <td>{{stu.age}}</td>
                <td>
                    <input type="button" value="修改" @click="handleUpdate(stu._id)">
                    <input type="button" value="删除" @click="handleDelete(stu._id)">
                </td>
            </tr>
        </tbody>
    </table>
  </div>
</template>

<script>
import {remove,findById} from '../../services/student';
export default { 
    props:["students"],
    methods:{
        async handleDelete(id){
            await remove(id);
            this.$emit('show');
        },
        async handleUpdate(id){
            let student = await findById(id);
            this.$emit('setStudent',student);
        }
    }
}
</script>

<style>

</style>